<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org" lang="en">
<head>
<meta name="format-detection" content="telephone=no"/>
<meta http-equiv="x-rim-auto-match" content="none"/> 
<meta name="viewport" id="viewport"	content="initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no, width=device-width"/>

    <title>警报信息</title>
    <script th:src="${ctx+'/resources/js/jquery-1.9.1.min.js'}" type="text/javascript"></script>
	<script th:src="${ctx+'/resources/js/jquery.md5.js'}" type="text/javascript"></script>
	<script th:src="${ctx+'/resources/js/sweet-alert.js'}" type="text/javascript"></script>
	<link th:href="${ctx+'/resources/css/style.css'}" rel="stylesheet" type="text/css"/>
	<link th:href="${ctx+'/resources/css/sweet-alert.css'}" rel="stylesheet" type="text/css"/>
	<link rel="shortcut icon" th:href="${ctx+'/resources/images/favicon.ico'}"/>
	<script th:src="${ctx+'/resources/js/facility/facility.js'}" type="text/javascript"></script>
	<script th:src="@{/resources/js/init.js}" type="text/javascript"></script>
	<script th:src="${ctx+'/resources/js/warning/warning.js'}" type="text/javascript"></script>
	
</head>
<body class="warningPage">
<div id="warningVal" style="overflow-y: scroll;">
	<div th:replace="menu :: facilityDiv"></div>
<!-- 	<div th:replace="menu :: rightMain"> -->
	
<!-- 	</div> -->
		

		
</div>

</body>
<script type="text/javascript">
$('#lableViews',window.parent.document).find("#rightMain_title").html("警报信息");

	var userVal ='<div id = "warningVal" style="overflow-y: scroll;"></div>';
// 	$(".rightMain").append(userVal);
	$(".leftNav a").eq(6).css("background","rgb(26,99,190)");
</script>
	<script th:src="${ctx+'/resources/js/user/loginout.js'}" type="text/javascript"></script>
	<script th:src="${ctx+'/resources/js/user/user.js'}" type="text/javascript"></script>
	<script type="text/javascript" th:inline="javascript"
	th:with="basePath=${'ws://'+#request.serverName+':'+#request.serverPort+#request.contextPath}">
	$(document).ready(function(){
		 var wsurl = [[${basePath +'/webSocket/alarmLog.ws?istrigger=true'}]];
		 	 ws = null;
			 ws = new WebSocket(wsurl);
   			 ws.onopen = function() {
			console.log('websocket 打开成功');
   	}; 
		 //当收到服务端的消息时
		ws.onmessage = function(result) {
		    //result.data 是服务端发来的数据
		    if(result.data=="WebSocket:connected OK!"){
		    }else{
		        var result=JSON.parse(result.data);
			    result = result.data;
			    console.log(result);
			    if (result instanceof Array) {
			        var page = '';
					for(var i = 0;i<result.length;i++){
						var alertVal = '';
						var myTime = new Date(parseInt(result[i].createTime)).toLocaleString().replace(/:\d{1,2}$/,' ')
						if(typeof(result[i].alertEvent.temperature)!="undefined"){
							alertVal +="温度:"+result[i].alertEvent.temperature+"℃ ";
						}
						if(typeof(result[i].alertEvent.temperature)!="undefined"){
							alertVal +="湿度:"+result[i].alertEvent.temperature+"% ";
						}
						if(typeof(result[i].alertEvent.battery)!="undefined"){
							alertVal +="电量:"+result[i].alertEvent.battery+"%";
						}
						if(typeof(result[i].alertEvent.owedTotal)!="undefined"){
							alertVal +="欠费:"+result[i].alertEvent.owedTotal+"￥";
						}
						if(typeof(result[i].alertEvent.walletMony)!="undefined"){
							alertVal +="余额:"+result[i].alertEvent.walletMony+"￥";
						}
						 var myA='<a id="" href="#" class="tagList">'+
						 '<table cellspacing="1" cellpadding="0"><tbody cellspacing="1" cellpadding="0" style="padding:0;margin:0;width:100%">'+
						 '<tr><td colspan="4">编号<span id="">'+result[i].targetSn+'</span></td></tr>'+
						 '<tr><td>异常信息:</td><td id="" colspan="3">'+alertVal+'</td></tr>'+
						 '<tr><td colspan="4" id="">上报时间:'+myTime+'</td></tr>'+
						 '</tbody></table></a>';
//					 $("#lableList").append(myA);/*将生成的每一条标签信息插入显示框*/
					 page += myA;
					}
					$("#warningVal").append(page);
					$("#myWhite").remove();
					var myWhite = '<div id="myWhite" style="height:80px;width:100%;background:transparent"></div>';
					$("#warningVal").append(myWhite);
			    }			
			    
		        }
		    }
		// 当websocket关闭时
		//ws.onclose = function() {
		 //   alert("websocket 连接关闭");
		//};
		// 当出现错误时
		ws.onerror = function(e) {
		    console.log("出现错误"+e);
		}

});
	
	</script>

</html>